<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0" id="list" lay-title="佣金记录">
	<div class="layui-fluid">
		<div class="layui-row layui-col-space15">
			<div class="layui-col-md12">
				<div class="layui-card hxr-layui-card" id="userlistv">
					<div class="layui-form layui-card-header hxradmin-card-header">
						<div class="layui-form-item">
							<div class="layui-inline">
								<label class="layui-form-label">关键词查询</label>
								<div class="layui-input-inline">
									<input type="text" name="user" placeholder="会员名称/代理商名称/设备编号" class="layui-input" autocomplete="off">
								</div>
							</div>
							<div class="layui-inline">
								<label class="layui-form-label" style='width:100px;'>消费结束日期范围</label>
								<div class="layui-input-inline" style="width: 350px;    ">
									<input type="text" name="val2" id='date' placeholder="请选择日期" autocomplete="off" class="layui-input" readonly>
								</div>
							</div>
							<div class="layui-inline">
								<button class="layui-btn" data-type="reload" id="search">搜索</button>
							</div>
							<div class="layui-inline">
								<button class="layui-btn" data-type="excel" id="pexcel">导出数据</button>
							</div>
						</div>
					</div>
					<div class="layui-card-body">
						<table class="layui-hide" id="list-table" lay-filter="list-table"></table>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/html" id="device_m">
	{{ d.device_name }}--{{d.device_sn}}
</script>
<script>
	var userlist=new Vue({
		el:'#userlistv',
		data:{
			d:0,
			role:[{
				role_id:1,
				role_name:"角色1"
			},{
				role_id:2,
				role_name:"角色2"
			}]
		},
		created() {
			/* layui.admin.ajax('role/list',{},1).then((res)=>{
				this.role=res.data.list;
			}).catch((res)=>{}); */
		}
	});
	var formurl='drawings/drawingsform',formarea=['500px', '570px'];
	//表格数据渲染
	
	layui.use(['table', 'form','laydate'], function() {
		var table = layui.table,
			form = layui.form,
			$ = layui.$,laydate=layui.laydate;
			//日期范围
			  laydate.render({
			    elem: '#date'
			    ,range: "~"
			  });
			layui.admin.initlist(table,'agents/commission_record_list',240,[
						[{
							field: 'commission_record_id',
							title: 'ID',
							width: 60
						},{
							field: 'member_name',
							title: '会员名称',
							width: 150
						},{
							field: 'device_name',
							title: '设备',
							width: 300,
							templet:'#device_m'
						},{
							field: 'device_id',
							title: '设备id',
							width: 110

						},{
							field: 'agent_name',
							title: '代理商名称',
							minWidth: 150
						},{
							field: 'description',
							title: '消费信息',
							minWidth: 100
						}, {
							field: 'commission_amount',
							title: '提成金额(元)',
							width: 110
						}, {
							field: 'consume_amount',
							title: '消费金额(元)',
							width: 110
						}, {
							field: 'commission_proportion',
							title: '提成比例(%)',
							width: 120
						}, {
							field: 'create_time',
							title: '创建时间',
							width: 200
						}]
					])

		//搜索
		$('#search').on('click', function() {
			var obj=$(this).parents('.layui-form-item');
			var val1 = obj.find('input[name="user"]').val();
			var val2 = $('input[name="val2"]').val();
			if (val2){
				var datemin=val2.split('~')[0],datemax=val2.split('~')[1];
			}else{
				var datemin='',datemax='';
			}
			layui.admin.reloads({
				search_text:val1,
				datemin:datemin,
				datemax:datemax
			});
		});
		//导出
		$('#pexcel').on('click', function() {
			var obj=$(this).parents('.layui-form-item');
			var val1 = obj.find('input[name="user"]').val();
			layui.admin.excel(table,'agents/commission_record_list',
					{
						search_text:val1
					},'');
		});
	});
</script>
